<script type='text/javascript' src='./scripts/jquery-1.4.2.min.js'></script>
<script type='text/javascript' src='./scripts/scroll-util.js'></script>

<table border="0" cellpadding="0" cellspacing="0" height="100%">
	<tr>
        <td valign="middle">
        	<table>
            	<tr><td>Auto Scroll Not Looped:</td></tr>
            	<tr>
                	<td valign="middle" align="center" height="100" width="520" class="horizontalAutoScroll">
                        <table border="0" cellpadding="1" cellspacing="0" width="100%" height="100">
                            <tr height="100" valign="middle">
							<?php
							// Ham so sanh phan tu cua 2 array.
                            function equal($unitCompare, $newData)
                            {
                                for ($i=0; $i<count($unitCompare); $i++)
                                {
                                    if ($unitCompare[$i]!=$newData[count($newData)-count($unitCompare)+$i])
                                        return false;
                                }
                                return true;
                            }
							// So luong image trong 1 trang
                            $unit = 4;
                            $data = array("<td width=\"100\"><img src=\"./images/normal.gif\" border=\"0\" width=\"100\" height=\"100\" /></td>", 
                                          "<td width=\"100\"><img src=\"./images/gold.gif\" border=\"0\" width=\"100\" height=\"100\" /></td>", 
                                          "<td width=\"100\"><img src=\"./images/platium.gif\" border=\"0\" width=\"100\" height=\"100\" /></td>", 
                                          "<td width=\"100\"><img src=\"./images/dinamond.gif\" border=\"0\" width=\"100\" height=\"100\" /></td>", 
                                          "<td width=\100\"><img src=\"./images/hot.gif\" border=\"0\" width=\"100\" height=\"100\" /></td>");
							//---------------------------------------------------------------------------------
							// Doan code nay dung de tao them noi dung trong truong hop Looped khi scroll
                            $unitCompare = $newData = array();
                            for ($i=0; $i<count($data); $i++) 
                            {
                                if ($i<$unit) $unitCompare[] = $data[$i];
                                $newData[] = $data[$i];
                            }
                            $nextData = 0;
                            while (true)
                            {
                                if ($nextData>=count($data)) $nextData = 0;
                                $newData[] = $data[$nextData];	
                                if ((count($newData))%$unit == 0 && equal($unitCompare, $newData)) break;
                                $nextData++;
                                
                                if ($i>=1000) break;
                                $i++;
                            }
							// Ket thuc noi dung tao them noi dung khi co Looped scroll
							//---------------------------------------------------------------------------------
                            for ($i=0; $i<count($newData) && $i<15; $i++) echo $newData[$i];
                            ?>

                            </tr>
                        </table>
                    </td>
                </tr>
            	<tr><td>Auto Scroll Looped:</td></tr>
            	<tr>
                	<td valign="middle" align="center" height="100" width="520" class="horizontalAutoScrollLoop">
                        <table border="0" cellpadding="1" cellspacing="0" width="100%" height="100">
                            <tr height="100">
							<?php
                            for ($i=0; $i<count($newData); $i++) echo $newData[$i];
                            ?>
                            </tr>
                        </table>
                    </td>
                </tr>
            	<tr><td>Clicked Scroll Not Looped:</td></tr>
                <tr>
                	<td valign="middle" align="center" width="520" class="horizontalClickScroll">
                        <table border="0" cellpadding="1" cellspacing="0">
                            <tr>
							<?php
                            for ($i=0; $i<count($newData) && $i<5; $i++) echo $newData[$i];
                            ?>
                            </tr>
                        </table>
                    </td>
                </tr>
            	<tr><td>Clicked Scroll Looped:</td></tr>
                <tr>
                	<td valign="middle" align="center" width="520" class="horizontalClickScrollLoop">
                        <table border="0" cellpadding="1" cellspacing="0">
                            <tr>
							<?php
                            for ($i=0; $i<count($newData); $i++) echo $newData[$i];
                            ?>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
        </td>
        <td>
        	<table border="0" cellpadding="0" cellspacing="0" height="100%">
            	<tr valign="bottom">
                	<td>Auto Scroll Not Looped:</td>
                	<td>Auto Scroll Looped:</td>
                    <td>Clicked Scroll Not Looped:</td>
                    <td>Clicked Scroll Looped:</td>
                </tr>
                <tr valign="top">
                    <td width="200" valign="top" align="center" class="verticalAutoScroll">    
                       <table border="0" cellpadding="0" cellspacing="1" width="102" height="400">
                            <?php
                            $data = array("<tr><td width=\"100\"><img src=\"./images/normal.gif\" border=\"0\" width=\"100\" height=\"100\" /></td></tr>", 
                                          "<tr><td width=\"100\"><img src=\"./images/gold.gif\" border=\"0\" width=\"100\" height=\"100\" /></td></tr>", 
                                          "<tr><td width=\"100\"><img src=\"./images/platium.gif\" border=\"0\" width=\"100\" height=\"100\" /></td></tr>", 
                                          "<tr><td width=\"100\"><img src=\"./images/dinamond.gif\" border=\"0\" width=\"100\" height=\"100\" /></td></tr>", 
                                          "<tr><td width=\"100\"><img src=\"./images/hot.gif\" border=\"0\" width=\"100\" height=\"100\" /></td></tr>");
                            $unitCompare = $newData = array();
                            for ($i=0; $i<count($data); $i++) 
                            {
                                if ($i<$unit) $unitCompare[] = $data[$i];
                                $newData[] = $data[$i];
                            }
                            $nextData = 0;
                            while (true)
                            {
                                if ($nextData>=count($data)) $nextData = 0;
                                $newData[] = $data[$nextData];	
                                if ((count($newData))%$unit == 0 && equal($unitCompare, $newData)) break;
                                $nextData++;
                                
                                if ($i>=1000) break;
                                $i++;
                            }
                            for ($i=0; $i<count($newData) && $i<15; $i++) echo $newData[$i];
            
                            ?>
                        </table> 
                    </td>
                    <td width="200" valign="top" align="center" class="verticalAutoScrollLoop">            
                       <table border="0" cellpadding="0" cellspacing="1" width="102" height="400">
                            <?php
                            for ($i=0; $i<count($newData); $i++) echo $newData[$i];
                            ?>
                        </table> 
                    </td>
                     <td width="200" valign="top" align="center" class="verticalClickScroll">            
                       <table border="0" cellpadding="0" cellspacing="1" width="102" height="400">
                            <?php
                            for ($i=0; $i<count($newData) && $i<15; $i++) echo $newData[$i];
                            ?>
                        </table> 
                    </td>
                     <td width="200" valign="top" align="center" class="verticalClickScrollLoop">            
                       <table border="0" cellpadding="0" cellspacing="1" width="102" height="400">
                            <?php
                            for ($i=0; $i<count($newData); $i++) echo $newData[$i];
                            ?>
                        </table> 
                    </td>
                </tr>
            </table> 
        </td>
    </tr>
</table>
     
<script>
$(function(){	
	makeVerticalScrollable("td.verticalAutoScroll", "verticalAutoScroll", 100, 400, 70, false, false);
	makeVerticalScrollable("td.verticalAutoScrollLoop", "verticalAutoScrollLoop", 100, 400, 70, false, true);
	makeVerticalScrollable("td.verticalClickScroll", "verticalClickScroll", 100, 399, 70, true, false);
	makeVerticalScrollable("td.verticalClickScrollLoop", "verticalClickScrollLoop", 100, 399, 70, true, true);
	makeHorizontalScrollable("td.horizontalAutoScroll", "horizontalScroll", 397, 100, 70, false, false);
	makeHorizontalScrollable("td.horizontalAutoScrollLoop", "horizontalScrollLoop", 397, 100, 70, false, true);
	makeHorizontalScrollable("td.horizontalClickScroll", "horizontalClickScroll", 397, 100, 70, true, false);
	makeHorizontalScrollable("td.horizontalClickScrollLoop", "horizontalClickScrollLoop", 397, 100, 70, true, true);
});
</script>